<template>
  <div class="app-container">
    <div class="search-container">
      <el-tabs v-model="activeTabName" @tab-click="handleTabChange">
        <el-tab-pane label="项目信息" name="base">User</el-tab-pane>
        <el-tab-pane label="项目设备信息" name="device">Config</el-tab-pane>
        <el-tab-pane label="参建单位信息" name="corp">Role</el-tab-pane>
        <el-tab-pane label="项目进度信息" name="status">Task</el-tab-pane>
        <el-tab-pane label="项目专户信息" name="special_account">Task</el-tab-pane>
        <el-tab-pane label="项目保证金信息" name="guarantee">Task</el-tab-pane>
        <el-tab-pane label="项目工资信息" name="wage">Task</el-tab-pane>
        <el-tab-pane label="项目管理人员" name="manager">Task</el-tab-pane>
        <el-tab-pane label="项目普通工人" name="person">Task</el-tab-pane>
        <el-tab-pane label="管理人员考勤" name="manager_checkin">Task</el-tab-pane>
        <el-tab-pane label="普通工人考勤" name="person_checkin">Task</el-tab-pane>
        <el-tab-pane label="按天统计考勤" name="day_statistic_checkin">Task</el-tab-pane>
        <el-tab-pane label="按人统计考勤" name="person_statistic_checkin">Task</el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>
<script setup lang="ts">
import type { TabsPaneContext } from "element-plus";
const activeTabName = ref<any>("base");

//选项卡改变
const handleTabChange = (tab: TabsPaneContext, event: Event) => {
  activeTabName.value = tab.paneName;
};
</script>
<style scoped></style>
